'use client'

import { Button, Typography, Row, Col, Card, Space } from 'antd'
import Link from 'next/link'

const { Title, Paragraph } = Typography

export default function HomePage() {
  return (
    <div style={{ padding: '20px', minHeight: '100vh', backgroundColor: '#f5f5f5' }}>
      {/* Hero Section */}
      <div style={{ textAlign: 'center', padding: '60px 20px', background: 'white', marginBottom: '40px' }}>
        <Title level={1}>源头直供，品质保证</Title>
        <Paragraph style={{ fontSize: '18px', color: '#666', maxWidth: '600px', margin: '20px auto' }}>
          专业的高端海产品交易平台，提供从海洋到餐桌的完整溯源服务，
          为餐厅、酒店、批发商和高端消费者提供优质的海产品解决方案。
        </Paragraph>
        <Space size="large" style={{ marginTop: '30px' }}>
          <Link href="/products">
            <Button type="primary" size="large">
              浏览产品
            </Button>
          </Link>
          <Link href="/trace">
            <Button size="large">
              产品溯源
            </Button>
          </Link>
        </Space>
      </div>

      {/* Features */}
      <Row gutter={[24, 24]} style={{ marginBottom: '40px' }}>
        <Col xs={24} md={8}>
          <Card>
            <Title level={3}>🎣 源头直供</Title>
            <Paragraph>
              直接与渔船、养殖场合作，确保产品新鲜度和品质，
              省去中间环节，为客户提供更优惠的价格。
            </Paragraph>
          </Card>
        </Col>
        <Col xs={24} md={8}>
          <Card>
            <Title level={3}>🔍 完整溯源</Title>
            <Paragraph>
              每个产品都有独特的批次号和二维码，
              可追溯从捕捞到运输的完整流程，确保食品安全。
            </Paragraph>
          </Card>
        </Col>
        <Col xs={24} md={8}>
          <Card>
            <Title level={3}>🚚 冷链配送</Title>
            <Paragraph>
              专业的冷链物流体系，实时温度监控，
              确保产品在运输过程中保持最佳状态。
            </Paragraph>
          </Card>
        </Col>
      </Row>

      {/* CTA Section */}
      <div style={{ textAlign: 'center', padding: '40px 20px', background: 'white' }}>
        <Title level={2}>开始您的海产品采购之旅</Title>
        <Paragraph style={{ fontSize: '16px', color: '#666' }}>
          注册成为我们的会员，享受专业的海产品采购服务
        </Paragraph>
        <Link href="/register">
          <Button type="primary" size="large" style={{ marginTop: '20px' }}>
            立即注册
          </Button>
        </Link>
      </div>
    </div>
  )
}